import 'dart:ui';

import 'package:flutter/material.dart';
import 'package:photoxia/compant/Appcolor.dart';
import 'package:photoxia/screen/serach.dart';
import 'package:photoxia/screen/textScreen.dart';

import '../compant/Photos.dart';
import '../compant/TopUserItem.dart';
import '../compant/TrendingItem.dart';
import 'Photo.dart';
import 'Profile.dart';

class home extends StatefulWidget {
  const home({super.key});
//123
  @override
  State<home> createState() => _homeState();
}

class _homeState extends State<home> {
  List<Widget> childrens = [
    HomeScreen(),
    Search(),
    testScreen(index: '2'),
    Profile(),
  ];
  int count = 0;
  late PageController _pageController;
  @override
  void initState() {
    // TODO: implement initState
    super.initState();
    _pageController = PageController();
  }

  @override
  void dispose() {
    // TODO: implement dispose
    _pageController.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      extendBody: true,
      floatingActionButton: FloatingActionButton(
        onPressed: () {
          Navigator.push(context, MaterialPageRoute(builder: (context) {
            return Photo();
          }));
        },
        shape: CircleBorder(),
        elevation: 0,
        backgroundColor: Colors.transparent,
        child: Container(
          width: 80,
          height: 80,
          decoration: BoxDecoration(
            gradient: LinearGradient(
              begin: Alignment.topCenter,
              end: Alignment.bottomCenter,
              colors: [
                Color(0xffFFBCA6),
                Color(0xffFF876B),
              ],
            ),
            borderRadius: BorderRadius.circular(30), // 圆角
          ),
          child: Image.asset('assets/botton3.png'),
        ),
      ),
      floatingActionButtonLocation: FloatingActionButtonLocation.centerDocked,
      bottomNavigationBar: BottomAppBar(
        padding: EdgeInsets.symmetric(horizontal: 30),
        notchMargin: 20,
        elevation: 0,
        shape: CircularNotchedRectangle(),
        color: Colors.white.withOpacity(0.7),
        child: ClipPath(
          clipper: pathchip(),
          child: BackdropFilter(
            filter: ImageFilter.blur(sigmaX: 10, sigmaY: 10),
            child: Row(
              mainAxisAlignment: MainAxisAlignment.spaceBetween,
              children: [
                homeBottom(
                  imgC: 'assets/botton1C.png',
                  img: 'assets/bottom1.png',
                  pageController: _pageController,
                  select: count == 0,
                  count: 0,
                ),
                homeBottom(
                  imgC: 'assets/bottom2C.png',
                  img: 'assets/botton2.png',
                  pageController: _pageController,
                  count: 1,
                  select: count == 1,
                ),
                SizedBox(),
                homeBottom(
                  imgC: 'assets/bottom4C.png',
                  img: 'assets/botton4.png',
                  pageController: _pageController,
                  count: 2,
                  select: count == 2,
                ),
                homeBottom(
                  imgC: 'assets/bottom5C.png',
                  img: 'assets/botton5.png',
                  pageController: _pageController,
                  count: 3,
                  select: count == 3,
                ),
              ],
            ),
          ),
        ),
      ),
      body: PageView(
        onPageChanged: (value) {
          setState(() {
            count = value;
          });
        },
        controller: _pageController,
        children: childrens,
      ),
    );
  }
}

class HomeScreen extends StatelessWidget {
  const HomeScreen({
    super.key,
  });

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        leading: Container(),
        actions: [
          Image.asset('assets/icon17.png'),
          Padding(padding: EdgeInsets.all(30)),
        ],
      ),
      body: SingleChildScrollView(
        child: Padding(
          padding: const EdgeInsets.symmetric(horizontal: 30),
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              Text(
                'Explore',
                style: TextStyle(
                    color: textColor3,
                    fontSize: 27,
                    fontWeight: FontWeight.w600),
              ),
              Row(
                children: [
                  Text(
                    'Top image today',
                    style: TextStyle(
                        color: textColor2,
                        fontSize: 17,
                        fontWeight: FontWeight.w400),
                  ),
                  const SizedBox(
                    width: 20,
                  ),
                  Text(
                    '1st june, 18',
                    style: TextStyle(
                        color: textColor2,
                        fontSize: 9,
                        fontWeight: FontWeight.w400),
                  ),
                ],
              ),
              SingleChildScrollView(
                padding: EdgeInsets.all(0),
                scrollDirection: Axis.horizontal,
                child: Row(
                  children: [
                    Image.asset('assets/image1.png'),
                    Image.asset('assets/image2.png'),
                  ],
                ),
              ),
              Text(
                'Top image today',
                style: TextStyle(
                    color: textColor2,
                    fontSize: 17,
                    fontWeight: FontWeight.w400),
              ),
              const SingleChildScrollView(
                scrollDirection: Axis.horizontal,
                child: Row(
                  children: [
                    TrendingItem(
                      bc1: Color(0xffFFBCA6),
                      bc2: Color(0xffFF876B),
                      img: 'assets/Trending1.png',
                      text: 'Sunset',
                      tip: '405403 photos',
                    ),
                    TrendingItem(
                      bc1: Color(0xffACFAFF),
                      bc2: Color(0xff669FFF),
                      img: 'assets/Trending2.png',
                      text: 'Beauty',
                      tip: '64113 photos',
                    ),
                    TrendingItem(
                      bc1: Color(0xffFF92CB),
                      bc2: Color(0xffA06CFC),
                      img: 'assets/Trending3.png',
                      text: 'Mountain',
                      tip: '84211 photos',
                    ),
                  ],
                ),
              ),
              homeTitle(
                text: 'Photos from your interest',
                tip: 'See All',
              ),
              const Photos(),
              const Row(
                children: [
                  Expanded(
                    flex: 2,
                    child: Photos(),
                  ),
                  SizedBox(
                    width: 20,
                  ),
                  Expanded(
                    flex: 1,
                    child: Photos(),
                  ),
                ],
              ),
              const Row(
                children: [
                  Expanded(
                    flex: 1,
                    child: Photos(),
                  ),
                  SizedBox(
                    width: 20,
                  ),
                  Expanded(
                    flex: 2,
                    child: Photos(),
                  ),
                ],
              ),
              Center(
                child: Container(
                  width: 100,
                  padding: const EdgeInsets.all(10),
                  decoration: BoxDecoration(
                      borderRadius: BorderRadius.circular(20),
                      gradient: const LinearGradient(colors: [
                        Color(0xffFFBCA6),
                        Color(0xffFF876B),
                      ], begin: Alignment.topLeft, end: Alignment.bottomRight),
                      boxShadow: [
                        BoxShadow(
                            color: const Color(0xffFF876B).withOpacity(0.2),
                            offset: const Offset(0, 13),
                            blurRadius: 27)
                      ]),
                  height: 30,
                  child: const Center(
                    child: Text(
                      'Load More',
                      style: TextStyle(color: Colors.white, fontSize: 8),
                    ),
                  ),
                ),
              ),
              homeTitle(text: 'Top Users', tip: "See All"),
              const SingleChildScrollView(
                scrollDirection: Axis.horizontal,
                child: Row(
                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
                  children: [
                    TopUserItem(
                      img: 'assets/TopUsers1.png',
                      text: 'Jeffrey Campbell',
                      tip: 'Dhaka',
                      count1: '85',
                      count2: '1356',
                    ),
                    TopUserItem(
                      img: 'assets/TopUsers2.png',
                      text: 'John Jenkins',
                      tip: 'Tokiyo',
                      count1: '471',
                      count2: '195',
                    ),
                    TopUserItem(
                      img: 'assets/TopUsers3.png',
                      text: 'Charles Burton',
                      tip: 'New York',
                      count1: '657',
                      count2: '42183',
                    ),
                  ],
                ),
              ),
            ],
          ),
        ),
      ),
    );
  }
}

class homeBottom extends StatefulWidget {
  final String imgC;
  final String img;
  final PageController pageController;
  final int count;
  final bool select;
  const homeBottom({
    super.key,
    required this.imgC,
    required this.img,
    required this.pageController,
    required this.count,
    this.select = false,
  });

  @override
  State<homeBottom> createState() => _homeBottomState();
}

class _homeBottomState extends State<homeBottom> {
  @override
  Widget build(BuildContext context) {
    return GestureDetector(
      onTap: () {
        setState(() {
          widget.pageController.jumpToPage(widget.count);
        });
      },
      child: widget.select ? Image.asset(widget.imgC) : Image.asset(widget.img),
    );
  }
}

class homeTitle extends StatelessWidget {
  final String text;
  final String tip;

  const homeTitle({
    super.key,
    required this.text,
    required this.tip,
  });

  @override
  Widget build(BuildContext context) {
    return Row(
      mainAxisAlignment: MainAxisAlignment.spaceBetween,
      children: [
        Text(
          text,
          style: TextStyle(
              color: textColor2, fontSize: 17, fontWeight: FontWeight.w400),
        ),
        Text(
          tip,
          style: TextStyle(
              color: titleTip, fontSize: 9, fontWeight: FontWeight.w400),
        ),
      ],
    );
  }
}

class pathchip extends CustomClipper<Path> {
  @override
  getClip(Size size) {
    // TODO: implement getClip
    Path path = Path()
      ..moveTo(-30, 0)
      ..lineTo(size.width / 2 - 50, 0)
      ..relativeCubicTo(0, 0, 45, 90, 100, 0)
      ..lineTo(size.width + 60, 0)
      ..lineTo(size.width + 60, size.height + 60)
      ..lineTo(0, size.height + 60)
      ..close();
    return path;
  }

  @override
  bool shouldReclip(covariant CustomClipper oldClipper) {
    // TODO: implement shouldReclip
    return true;
  }
}
